<template>
  <div class="list-page">
    <tool-bar nav="" title="产品线">
      <el-button @click="add_click()">添加</el-button>

      <el-button size="small" @click="chk_data_click">检查</el-button>
    </tool-bar>
    <my-list
        ref="list"
        url="/dev/product-line/list"
        @param="preload"
        @loaded="procData"
        :page-size="10"
        :store="true"
    >

      <el-table-column align="center" label="集群" width="100">
        <template v-slot="scope">
          <el-tag v-if="scope.row.cluster">{{ scope.row.cluster.index }} : {{ scope.row.cluster.code }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="产品线名称" align="center" width="240" prop="name" sortable="custom">
        <template v-slot="scope">
          <div class="link" @click="edit_click(scope.row)"> {{ scope.row.name }}</div>
        </template>
      </el-table-column>
      <el-table-column align="center" label="编码" width="100" prop="code" sortable="custom">
        <template v-slot="scope">
          <el-tag>{{ scope.row.code }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="人员" align="left">
        <template v-slot="scope">
          <el-tag v-if="scope.row.lm.name">{{ scope.row.lm.name }}</el-tag>
          <el-tag v-if="scope.row.pm.name">{{ scope.row.pm.name }}</el-tag>
          <el-tag v-if="scope.row.leader.name">{{ scope.row.leader.name }}</el-tag>

          <span v-for="(item,index) in scope.row.developers" :key="index"> {{ item.name }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="240">
        <template v-slot="scope">
          <el-button type="warning" plain round @click="delete_click(scope.row,false)" size="small">
            删除
          </el-button>

          <el-button :type="scope.row.gitCount ? 'warning':''" plain round @click="delete_click(scope.row,true)" size="small">
            删除及gitData({{scope.row.gitCount}})
          </el-button>
        </template>
      </el-table-column>
      <template #query="scope">
        <kv label="名称/编码">
          <el-input v-model="scope.query.name"></el-input>
        </kv>
        <kv label="序号">
          <el-input v-model="scope.query.index"></el-input>
        </kv>

        <kv label="用户">
          <el-input v-model="scope.query.user"></el-input>
        </kv>
      </template>
    </my-list>
  </div>
</template>

<script setup>



//定义 vue2的this,当前组件
let $self = getCurrentInstance();

//定义 $attrs
let $attrs = useAttrs()


//定义事件
let $emit = defineEmits(["update:modelValue","loaded"]);

//定义属性
var $props = defineProps({
    query: {
        type: Object, default() {
            return {};
        }
    }
});

const list = ref();


const preload = function (param) {
    //添加查询参数，修改分页参数等。
    //param.type = jv.$route.params.type
}
//处理列表的数据
const procData = function (res) {
    res.data.data.forEach(it => {
        //如果是组合实体，设置 it.id=...
    });
}
//查询
const  loadData =function (pageNumber) {
    list.value.loadData(pageNumber);
}

const chk_data_click = function () {
    jv.$http.post("/dev/product-line/chk-data").then(res => {
        jv.info("没有问题!")
    });
}

const add_click = function () {
    jv.$router.push("/dev/product-line/add")
}

const edit_click =function ( row) {
    //记录上次点击行
    var rowId = row.id;

    jv.$router.push("/dev/product-line/edit/" + rowId)
}

const delete_click = function (row, withRowData) {
    var rowId = row.id;
    var rowName = row.name;
    jv.confirm('确认删除 ' + rowName + ' 吗？').then(res => {
        jv.$http.post("/dev/product-line/delete/" + rowId, {withRowData: withRowData}).then(res => {
            //[axios拦截器中已处理了异常]。
            loadData();
        })
    });
}
</script>